﻿<UserControl x:Class="VNet.VisiSuite.Controls.UtilizationGraphControl"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:vuc="clr-namespace:VNet.VisiSuite.Controls"
             xmlns:converter="clr-namespace:VNet.VisiSuite.Common.Converters;assembly=VNet.VisiSuite.Common"
             xmlns:production="clr-namespace:VNet.VisiSuite.Common.Production;assembly=VNet.VisiSuite.Common"
             xmlns:ig="http://schemas.infragistics.com/xaml"
             mc:Ignorable="d" 
             x:Name="_this"
             d:DesignHeight="300" d:DesignWidth="300">

    <UserControl.Resources>
        
        <BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter" />
        <converter:InvertBooleanConverter x:Key="InvertBooleanConverter" />
        <converter:InvertBooleanVisibilityConverter x:Key="InvertBooleanVisibilityConverter" />
        <converter:IntObjectStringConverter x:Key="IntObjectStringConverter"/>
        <converter:ColorStringToColorConverter x:Key="ColorStringToColorConverter"/>

        <converter:BarMarkerConverter x:Key="BarMarkerConverter" />
        <converter:BarMarkerVisibleConverter x:Key="BarMarkerVisibleConverter" />

    </UserControl.Resources>
    <Grid DataContext="{Binding ElementName=_this}">
        <Grid.RowDefinitions>
            <RowDefinition Height="30" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>

        <TextBlock Text="{Binding GraphTitle}" Foreground="{StaticResource YellowColor}" FontSize="14pt" FontWeight="Bold" Grid.Row="0" Grid.Column="1" HorizontalAlignment="Center" VerticalAlignment="Center"/>
        <ig:XamDataChart VerticalAlignment="Stretch" VerticalContentAlignment="Stretch" Height="Auto" Grid.Row="1" Grid.Column="1" x:Name="_utilization_chart" 
                         Padding="0" Visibility="Visible" PlotAreaBorderBrush="{x:Null}" PlotAreaBackground="{x:Null}" >
            
            <ig:XamDataChart.Axes>
                <ig:CategoryXAxis x:Name="_x_axis" Label="{}{Key}" MajorStrokeThickness="0" MinorStrokeThickness="0" TickLength="3" TickStrokeThickness="1" Interval="1"
                                      ItemsSource="{Binding SeriesData, Mode=OneWay}">
                    <ig:CategoryXAxis.LabelSettings>
                        <ig:AxisLabelSettings FontSize="14"  Foreground="White" HorizontalAlignment="Center" VerticalAlignment="Center"></ig:AxisLabelSettings>
                    </ig:CategoryXAxis.LabelSettings>
                </ig:CategoryXAxis>
                <ig:NumericYAxis x:Name="_y_axis" MinimumValue="0" MaximumValue="{Binding MaxValue, Mode=OneWay}" Label="{}{0:#,#.}" Interval="10">
                    <ig:NumericYAxis.LabelSettings>
                        <ig:AxisLabelSettings FontSize="14" Foreground="White" VerticalAlignment="Center" HorizontalAlignment="Right" Padding="0 0 8 0"></ig:AxisLabelSettings>
                    </ig:NumericYAxis.LabelSettings>
                </ig:NumericYAxis>
            </ig:XamDataChart.Axes>
            <ig:XamDataChart.Series>
                <ig:ColumnSeries Title="Utilization" ValueMemberPath="Percent" Brush="#ffc000" IsHighlightingEnabled="True" IsTransitionInEnabled="False"
                            ItemsSource="{Binding SeriesData, Mode=OneWay}" XAxis="{Binding ElementName=_x_axis}" YAxis="{Binding ElementName=_y_axis}">
                    <ig:ColumnSeries.MarkerTemplate>
                        <DataTemplate>
                            <Grid Margin="0,-32,0,0">
                                <!--
                                <Grid.LayoutTransform>
                                    <RotateTransform Angle="-90"></RotateTransform>
                                </Grid.LayoutTransform>
                                -->
                                <TextBlock Margin="2"
                                            Text="{Binding Item.PercentMarker}"
                                            FontFamily="Segoe UI"
                                            FontSize="14"
                                            Foreground="White"
                                            HorizontalAlignment="Center" VerticalAlignment="Center" />
                            </Grid>
                        </DataTemplate>
                    </ig:ColumnSeries.MarkerTemplate>
                </ig:ColumnSeries>
            </ig:XamDataChart.Series>
        </ig:XamDataChart>

    </Grid>
</UserControl>
